<template>
  <div>
    <!-- <el-row>
      <el-col :span="12"
        ><div class="grid-content bg-purple">
          <Tree
            :treeDataInterfaceName="treeDataInterfaceName"
            childrenName="nodes"
            @change="getSelected"
            :viewCount="10"
          /></div
      ></el-col>
      <el-col :span="12"><OldTree /></el-col>
      </el-row> -->
    <TreeSelect
      :initTreeData="treeData"
      childrenName="nodes"
      :viewCount="10"
      :single="true"
      :inputTree="inputTree"
    />
  </div>
</template>

<script>
import { getTreeData } from "../../api/tree";
import TreeSelect from "../../components/TreeSelect";
export default {
  components: { TreeSelect },
  data() {
    return {
      treeData: [],
      treeDataInterfaceName: getTreeData,
      inputTree: {
        // hidden: true, //控制组件显示隐藏
        // multiple: true, // 启用下拉树的 多选 功能
        // setParent: true, //是否能选中父节点
        keys: {
          textKey: "name",
          childKey: "nodes",
          valueKey: "id",
        },
        // enable: false, //控件是否可选
        placeholder:
          "请选择1请选择1请选择1请选择1请选择1请选择1请选择1请选择1请选择1", //输入框提示字
        defaultKeys: ["20180409020000000000743", 1],
      },
    };
  },
  methods: {
    getSelected(node, status, nodes) {
      console.log(node);
      console.log(status);
      console.log(nodes);
    },
    // 获取树接口数据
    getTreeData() {
      getTreeData().then((res) => {
        // console.log(res);
        if (res.status == 200) {
          this.treeData = res.data.treeData;
          // console.log(this.treeData.treeData);
        }
      });
    },
  },
  mounted() {
    this.getTreeData();
  },
};
</script>

<style></style>
